import Vue from "vue";
import Router from "vue-router";
import Login from "@/views/login";
import store from "../store/index";

Vue.use(Router);

const router = new Router({
  routes: [{
    path: "/",
    name: "root",
    component: () => import(/* webpackChunkName: "root" */ "@/views/root"),
    meta: {
      requireAuth: true
    },
    redirect: {
      name: "home"
    },
    children: [{
      path: "/home",
      name: "home",
      component: () => import(/* webpackChunkName: "home" */ "@/views/root/home")
    }, {
      path: "/charts",
      name: "charts",
      component: () => import(/* webpackChunkName: "charts" */ "@/views/root/charts"),
      redirect: {
        name: "bar"
      },
      children: [{
        path: "/charts/bar",
        name: "bar",
        component: () => import(/* webpackChunkName: "charts" */ "@/views/root/charts/bar")
      }, {
        path: "/charts/line",
        name: "line",
        component: () => import(/* webpackChunkName: "charts" */ "@/views/root/charts/line")
      }, {
        path: "/charts/pie",
        name: "pie",
        component: () => import(/* webpackChunkName: "charts" */ "@/views/root/charts/pie")
      }]
    }, {
      path: "/ui",
      name: "ui",
      component: () => import(/* webpackChunkName: "ui" */ "@/views/root/ui"),
      redirect: {
        name: "base"
      },
      children: [{
        path: "/ui/base",
        name: "base",
        component: () => import(/* webpackChunkName: "ui" */ "@/views/root/ui/base")
      }, {
        path: "/ui/date",
        name: "date",
        component: () => import(/* webpackChunkName: "ui" */ "@/views/root/ui/date")
      }, {
        path: "/ui/file",
        name: "file",
        component: () => import(/* webpackChunkName: "ui" */ "@/views/root/ui/file")
      }, {
        path: "/ui/rich-editor",
        name: "rich-editor",
        component: () => import(/* webpackChunkName: "ui" */ "@/views/root/ui/rich-editor")
      }, {
        path: "/ui/map",
        name: "map",
        component: () => import(/* webpackChunkName: "ui" */ "@/views/root/ui/map")
      }, {
        path: "/ui/cascader",
        name: "cascader",
        component: () => import(/* webpackChunkName: "ui" */ "@/views/root/ui/cascader")
      }]
    }, {
      path: "/forms",
      name: "forms",
      component: () => import(/* webpackChunkName: "forms" */ "@/views/root/forms"),
      redirect: {
        name: "simple"
      },
      children: [{
        path: "/forms/simple",
        name: "simple",
        component: () => import(/* webpackChunkName: "forms" */ "@/views/root/forms/simple")
      }, {
        path: "/forms/valid",
        name: "valid",
        component: () => import(/* webpackChunkName: "forms" */ "@/views/root/forms/valid")
      }]
    }, {
      path: "/grids",
      name: "grids",
      component: () => import(/* webpackChunkName: "grids" */ "@/views/root/grids"),
      redirect: {
        name: "list"
      },
      children: [{
        path: "/grids/list",
        name: "list",
        component: () => import(/* webpackChunkName: "grids" */ "@/views/root/grids/list")
      }, {
        path: "/grids/page",
        name: "page",
        component: () => import(/* webpackChunkName: "grids" */ "@/views/root/grids/page")
      }, {
        path: "/grids/tree",
        name: "tree",
        component: () => import(/* webpackChunkName: "grids" */ "@/views/root/grids/tree")
      }, {
        path: "/grids/tree-grid",
        name: "tree-grid",
        component: () => import(/* webpackChunkName: "grids" */ "@/views/root/grids/tree-grid")
      }]
    },{
      path: "/notice",
      name: "notice",
      component: () => import(/* webpackChunkName: "notice" */ "@/views/root/notice"),
      redirect: {
        name: "message"
      },
      children: [{
        path: "/notice/message",
        name: "message",
        component: () => import(/* webpackChunkName: "notice" */ "@/views/root/notice/message")
      }, {
        path: "/notice/message-box",
        name: "message-box",
        component: () => import(/* webpackChunkName: "notice" */ "@/views/root/notice/message-box")
      }, {
        path: "/notice/notify",
        name: "notify",
        component: () => import(/* webpackChunkName: "notice" */ "@/views/root/notice/notify")
      }]
    }, {
      path: "/other",
      name: "other",
      component: () => import(/* webpackChunkName: "other" */ "@/views/root/other"),
      redirect: {
        name: "tab"
      },
      children: [{
        path: "/other/tab",
        name: "tab",
        component: () => import(/* webpackChunkName: "other" */ "@/views/root/other/tab")
      }, {
        path: "/other/carousel",
        name: "carousel",
        component: () => import(/* webpackChunkName: "other" */ "@/views/root/other/carousel")
      }, {
        path: "/other/collapse",
        name: "collapse",
        component: () => import(/* webpackChunkName: "other" */ "@/views/root/other/collapse")
      }, {
        path: "/other/rate",
        name: "rate",
        component: () => import(/* webpackChunkName: "other" */ "@/views/root/other/rate")
      }, {
        path: "/other/axios",
        name: "axios",
        component: () => import(/* webpackChunkName: "other" */ "@/views/root/other/axios")
      }]
    }, {
      path: "/demo",
      name: "demo",
      component: () => import(/* webpackChunkName: "demo" */ "@/views/root/demo"),
      redirect: {
        name: "basic"
      },
      children: [{
        path: "/demo/basic",
        name: "basic",
        component: () => import(/* webpackChunkName: "demo" */ "@/views/root/demo/basic")
      }]
    }]
  }, {
    path: "/login",
    name: "login",
    component: Login
  }, {
    path: "*",
    redirect: {
      name: "root"
    }
  }]
});

router.beforeEach((to, from, next) => {
  if (to.matched.some(r => r.meta.requireAuth)) {
    if (store.state.token) {
      next();
    } else {
      next({
        path: "/login",
        query: { redirect: to.fullPath }
      });
    }
  } else {
    next();
  }
});

export default router;
